<!DOCTYPE html>
<html lang="zh-CN">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0, user-scalable=no" />
    <script type="text/javascript">
        window.onload=function () {
                document.addEventListener('touchstart',function (event) {
                    if(event.touches.length>1){
                        event.preventDefault();
                    }
                })
                var lastTouchEnd=0;
                document.addEventListener('touchend',function (event) {
                    var now=(new Date()).getTime();
                    if(now-lastTouchEnd<=300){
                        event.preventDefault();
                    }
                    lastTouchEnd=now;
                },false)
            }
    </script>
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <link rel="stylesheet" type="text/css" href="./css/style.min.css">
    <title>收货地址</title>
</head>
<body>
<div id="personal_center">
    <div class="t-container">
        <header class="cl" v-show="header.show">
            <div class="nav-bar cl">
                <span class="goback arrow_l" @click="goback"></span>
                <span class="page-name" v-cloak>{{shop_name}}会员店</span>
            </div>
        </header>
        <div class="t-main">
            <div class="t-my-address-content">
                <div class="t-ma-header">
                    <p>共创建<span v-cloak>{{has}}</span>地址,还可以创建<span v-cloak>{{can}}</span>个</p>
                </div>
                <div class="t-ma-item" v-for="(item,$index) in items">
                    <div class="t-gap-box"></div>
                    <div class="t-ma-message">
                        <p>
                        <span v-cloak>{{item.recevier}}</span>
                        <span class="addr-tel" v-cloak>{{item.mobile}}</span>
                        </p>
                        <p class="address-p" v-cloak>{{item.addr_str}}{{item.addr}}</p>
                    </div>
                    <div class="item-group">
                        <a class="t-defail set-defail" @click="setDefail($index,item.addr_id)">
                            <i :class="{active:$index===selected}"><em></em></i>设为默认
                            <!-- <a href="javascript:void(0)" class="set-defail"></a> -->
                        </a>
                        <div class="t-btn-group">
                           <!--  <a v-bind:href="'add-address.html?addr_id=' + item.addr_id& + item.recevier + item.mobile + item.province + item.city + item.district + item.addr_name" class="t-icon-edit" ><i></i>编辑</a> -->
                            <a v-bind:href="url(item.addr_id)" class="t-icon-edit"><i></i>编辑</a>
                            <a href="javascript:void(0)" class="t-icon-del" @click="delAddr(item.addr_id)"><i></i>删除</a>
                        </div>
                    </div>
                </div>
            </div>
        </div>
        <toast ref="toast"></toast>
    </div>

    <div class="t-footer return-footer add-footer">
        <!-- <div class="t-btn-group"> -->
            <a :href="'add-address.html?storeid='+store_id" class="form-btn form-btn-a"><span class="icon-add">+</span><span>新增地址</span></a>
            <!-- <button type="submit" class="form-btn"><span>保存</span></button> -->
        <!-- </div> -->
    </div>
</div>
   <script src="./js/lib/vue.js"></script>
    <script src="http://static.jdhui.com/lib/vue-resource/1.2/vue-resource.js"></script>
    <script src="./js/min/config.min.js"></script>
    <script src="./js/min/common.min.js"></script>
    <script src="./js/min/component.min.js"></script>
<script>
    var toast = new component.popup.toast();
    var app = new Vue({
        el:'#personal_center',
        data:{
			header:{
				show: !APP.iswechat()
			},
            items:[],
            selected:'0',
            has:'',
            can:'',
            // def:false,
            store_id:APP.getQueryString('storeid'),
			shop_name: ''
        
        },
        mounted:function(){
			APP.init(this,function (){
            	this.shop_name = APP.getCookie('shopname');
            }.bind(this),function (arg){
            	this.shop_name = arg.body.data.shop.shop_name;
            }.bind(this));
            this.getData();
            console.log(this.store_id)
        },
        components: {
                'toast': toast
        },
        methods:{
            goback:function(){
                    //window.history.go(-1);
                    window.location.href = "personal-center.html?storeid="+ this.store_id
            },
            //设置默认
           setDefail:function(index,aid){
                // console.log(index,aid);
                this.selected = index;
                Vue.http.get(APIPHP + 'index.php?r=member/u/recipient-set&storeid='+ this.store_id +'&id='+aid).then(function(data){
                    console.log(data.body);
                    if(data.body.flag == 1){
                       console.log(this.selected); 
                    }
                }.bind(this))
           },
            //获取地址列表
            getData:function(){
                console.log(this.store_id);
                Vue.http.options.xhr = {
                    withCredentials: true
                }
                Vue.http.options.credentials = true;
                Vue.http.get(APIPHP + 'index.php?r=member/u/recipient&storeid='+ this.store_id).then(function(_res){
                    console.log(_res.body.data.data)
                    this.items = _res.body.data.data;
                    this.has = _res.body.data.addr_has_create;
                    this.can = _res.body.data.addr_can_create;
                    _res.body.data.data.forEach(function (v,k)  {
                        if(v.def_addr == 1){
                            this.selected = k;
                        }
                    }.bind(this));
                }.bind(this))
               
            },
            //删除地址
            delAddr:function(aid){
                Vue.http.get(APIPHP + 'index.php?r=member/u/recipient-del&storeid='+ this.store_id + '&id='+aid).then(function(data){
                    console.log(data.body);
                    if(data.body.flag == 1){
                       // console.log(this.selected); 
                       this.$refs.toast.show('删除成功');
                       this.getData();
                    }else{
                        this.$refs.toast.show(data.body.msg);
                    }
                }.bind(this))
            },
            //编辑地址
            // editAddr:function(){
            //     Vue.http.post(APIPHP + 'index.php?r=member/u/recipient-add',{

            //     },{emulateJSON:true})
            // }
            url:function(id){
                return 'add-address.html?storeid='+ this.store_id +'&addr_id='+id;
            }
        }
    })
</script>
</body>
</html>